當你的專案只有兩三支 API 時，全部寫在 app.js 裡感覺很直覺。但想像一下，一個真實的電商系統會有「會員」、「商品」、「購物車」、「訂單」等數十甚至數百支 API。如果全部塞在同一個檔案，你的 app.js 會變成數千行的「義大利麵條程式碼」，光是找一行 bug 就會讓你崩潰。

今天，我們要學習 Express.js 最強大的結構化武器：express.Router。我們要進行後端開發的第一次「檔案拆分」，把路由分門別類。

1. 核心概念：HTTP 動詞與 CRUD

在設計路由時，我們不應該只用 GET 和 POST 打天下。業界標準是將 HTTP 動詞與資料庫的 CRUD (新增、讀取、更新、刪除) 完美對應：

• POST (Create)：新增資料（例如：註冊新帳號、新增商品）。
• GET (Read)：讀取資料（例如：取得會員列表、查詢特定訂單）。
• PUT (Update)：更新資料（例如：修改個人檔案）。
• DELETE (Delete)：刪除資料（例如：取消訂單）。

透過不同的動詞，你可以讓同一個網址擁有完全不同的功能。例如 /users 可以同時接收 GET (取得所有使用者) 和 POST (新增使用者)。

2. 實作練習：使用 express.Router 拆分路由

我們現在要把關於「使用者 (Users)」的 API 邏輯，從 app.js 裡抽離出來，放到專屬的資料夾與檔案中。

步驟 1：建立路由資料夾

在你的 express-api 專案目錄下，新增一個資料夾叫做 routes。
在 routes 資料夾內，新增一個檔案 users.js。

步驟 2：撰寫獨立的 Router 檔案

打開 routes/users.js，輸入以下程式碼：

import express from 'express';

// 建立一個專屬於使用者的迷你應用程式 (Router)
const router = express.Router();

// 取得所有使用者
// 注意：這裡的網址只寫 '/'，因為稍後在 app.js 我們會幫它加上前綴
router.get('/', (req, res) => {
    res.json({ message: '取得所有使用者清單' });
});

// 取得單一使用者 (動態參數)
router.get('/:id', (req, res) => {
    const { id } = req.params;
    res.json({ message: `取得 ID 為 ${id} 的使用者` });
});

// 新增使用者
router.post('/', (req, res) => {
    const { username } = req.body;
    res.json({ message: `成功新增使用者：${username}` });
});

// 更新使用者
router.put('/:id', (req, res) => {
    const { id } = req.params;
    res.json({ message: `使用者 ${id} 的資料已更新` });
});

// 刪除使用者
router.delete('/:id', (req, res) => {
    const { id } = req.params;
    res.json({ message: `使用者 ${id} 已被刪除` });
});

// 最後，將這個 Router 匯出
export default router;

步驟 3：在主程式中掛載 Router

現在回到你的主程式 app.js，我們要將剛才寫好的 users.js 引入，並「掛載」到特定的網址前綴上。

將 app.js 修改成這樣：

import express from 'express';
import userRoutes from './routes/users.js'; // 引入我們剛剛寫的 Router 模組

const app = express();
const PORT = 3000;

app.use(express.json());

// 首頁路由 (保留在主程式)
app.get('/', (req, res) => {
    res.send('<h1> 路由設計美學 伺服器啟動！</h1>');
});

// 關鍵魔法：將 userRoutes 掛載到 '/api/users' 這個路徑底下
// 以後所有進到 /api/users 的請求，都會轉交給 routes/users.js 處理
app.use('/api/users', userRoutes);

app.listen(PORT, () => {
    console.log(` 伺服器已啟動：http://localhost:${PORT}`);
});

3. 測試你的模組化架構

現在執行 node app.js，並打開你的 API 測試工具 (Thunder Client 或 Postman)。
試著發送以下請求：

1. GET http://localhost:3000/api/users -> 會回應「取得所有使用者清單」。
2. POST http://localhost:3000/api/users (記得帶 JSON body) -> 會回應「成功新增使用者...」。
3. PUT http://localhost:3000/api/users/99 -> 會回應「使用者 99 的資料已更新」。
4. DELETE http://localhost:3000/api/users/99 -> 會回應「使用者 99 已被刪除」。

你發現了嗎？你在 users.js 裡面設定的路徑都只有寫 / 或是 /:id，但因為在 app.js 裡面使用了 app.use('/api/users', ...)，Express 自動幫你把前面的路徑拼湊起來了。

這種拆分方式，讓你的 app.js 永遠保持乾淨。未來就算你要新增「商品」、「訂單」的功能，只需要在 routes 資料夾新增對應的檔案，然後在 app.js 加上一兩行 app.use() 就能搞定。